<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title> Post A Job</title>

    <link th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/>
    <link th:href="@{/font-awesome/css/font-awesome.css}" rel="stylesheet"/>

    <link th:href="@{/css/plugins/steps/jquery.steps.css}" rel="stylesheet"/>
    <link th:href="@{/css/plugins/toastr/toastr.min.css}" rel="stylesheet"/>

    <link th:href="@{/css/animate.css}" rel="stylesheet"/>
    <link th:href="@{/css/style.css}" rel="stylesheet"/>

</head>
<body>
<div id="wrapper">
    <div th:include="common/navbar_left :: navbar_left"></div>
    <div id="page-wrapper" class="gray-bg">
        <div class="row border-bottom" th:include="common/navbar_header :: navbar_header"></div>
        <div class="row wrapper border-bottom white-bg page-heading">
            <div class="col-lg-10">
                <h2>Post A Job</h2>
                <ol class="breadcrumb">
                    <li>
                        <a>Home</a>
                    </li>
                    <li>
                        <a>Job Information</a>
                    </li>
                    <li class="active">
                        <strong>Job</strong>
                    </li>
                </ol>
            </div>
            <div class="col-lg-2">

            </div>
        </div>
        <div class="wrapper wrapper-content animated fadeInRight">
            <div class="row">
                <div class="col-lg-10">
                    <div class="ibox float-e-margins">
                        <div class="ibox-title">
                            <h5>Post a job and notice your follower</h5>
                            <div class="ibox-tools">
                                <a class="collapse-link">
                                    <i class="fa fa-chevron-up"></i>
                                </a>
                            </div>
                        </div>

                        <div class="ibox-content">
                            <form method="post" th:action="@{/jobs/post}" class="form-horizontal">
                                <input name="cId" type="hidden" th:value="${session.user_id}"/>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">Title</label>
                                    <div class="col-sm-10">
                                        <input name="title" type="text" class="form-control"/>
                                    </div>
                                </div>
                                <div class="hr-line-dashed"></div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">Salary</label>
                                    <div class="col-sm-10">
                                        <input name="salary" type="text" class="form-control"/>
                                    </div>
                                </div>
                                <div class="hr-line-dashed"></div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">Major Requirement</label>
                                    <div class="col-sm-10">
                                        <input name="remajor" type="text" class="form-control"/>
                                    </div>
                                </div>
                                <div class="hr-line-dashed"></div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">Degree Requirement</label>
                                    <div class="col-sm-10">
                                        <input name="redegree" type="text" class="form-control"/>
                                    </div>
                                </div>
                                <div class="hr-line-dashed"></div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">Work Place</label>
                                    <div class="col-sm-10">
                                        <input name="location" type="text" class="form-control"/>
                                    </div>
                                </div>
                                <div class="hr-line-dashed"></div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">Description</label>
                                    <div class="col-sm-10">
                                        <textarea name="description" id="description" type="text" class="form-control"/>
                                    </div>
                                </div>
                                <div class="hr-line-dashed"></div>
                                <div class="form-group">
                                    <div class="col-sm-4 col-sm-offset-2">
                                        <button class="btn btn-primary" type="submit">Post</button>
                                    </div>
                                </div>
                            </form>
                        </div>


                    </div>
                </div>
            </div>
        </div>
        <div class="footer">
            <div>
                <strong>Copyright</strong> Jobster &copy; 2018
            </div>
        </div>
    </div>
</div>
<!-- Mainly scripts -->
<div th:include="common/common_js :: common_js"></div>

<!-- Custom and plugin javascript -->
<script th:src="@{/js/inspinia.js}"></script>

<!-- Steps -->
<script th:src="@{/js/plugins/steps/jquery.steps.min.js}"></script>

<script th:src="@{/js/plugins/toastr/toastr.min.js}"></script>

<script th:inline="javascript" type="text/javascript">
    //<![CDATA[
    $(function () {
        $("#wizard").steps();
        var postmsg = [[${postMsg}]];
        if (postmsg !== "" && postmsg !== undefined && postmsg != null) {
            toastr.success(postmsg);
        }
    });

    $("#description").on("input", function () {
        $(this).css({height: '100px'});
        $(this).css({height: (this.scrollHeight - 60) + "px"});
    });

    toastr.options = {
        "closeButton": true,
        "debug": false,
        "progressBar": true,
        "preventDuplicates": false,
        "positionClass": "toast-top-right",
        "onclick": null,
        "showDuration": "400",
        "hideDuration": "1000",
        "timeOut": "7000",
        "extendedTimeOut": "1000",
        "showEasing": "swing",
        "hideEasing": "linear",
        "showMethod": "fadeIn",
        "hideMethod": "fadeOut"
    }
    //]]>
</script>
</body>
</html>
